<template>
	<view>
		<u-navbar title-color="#333" title-bold title-size="36" title="案源详情" :border-bottom="false"></u-navbar>
		<view class="sz-div u-m-t-22">
			<view class="item flex ">
				<view class="item-title">案件类型</view>
				<view class="item-value" v-if="detail.serve">{{detail.serve.name || '--'}}</view>
			</view>
			<view class="item flex ">
				<view class="item-title">当事人所在地</view>
				<view class="item-value">{{detail.province_name || '--'}}</view>
			</view>
			<view class="item flex ">
				<view class="item-title">发布时间</view>
				<view class="item-value">{{detail.pay_time || '--'}}</view>
			</view>
			<view class="item flex ">
				<view class="item-title">案件描述</view>
				<view class="item-value2">{{detail.content || '--'}}</view>
			</view>
			<view class="item flex ">
				<view class="item-title">涉案金额</view>
				<view class="item-value">
					<span v-if="!detail.price_dur_min && !detail.price_dur_max">面议</span>
					<span v-if="detail.price_dur_min && !detail.price_dur_max">{{detail.price_dur_min}}以上</span>
					<span v-if="!detail.price_dur_min && detail.price_dur_max">{{detail.price_dur_max}}以下</span>
					<span v-if="detail.price_dur_min && detail.price_dur_max">{{detail.price_dur_min}}~{{detail.price_dur_max}}</span>
				</view>
			</view>
		</view>
		<view class="sz-div u-m-t-22">
			<view class="item flex ">
				<view class="item-title">联系方式</view>
				<view class="item-value">服务开始后可见</view>
			</view>
			
			<view class="item flex " v-if="!detail.lawyer_package && detail.lawyer_level_id==0">
				<view class="item-title">案源价格</view>
				<view class="item-value">￥{{detail.share_price || '--'}}</view>
				<view class="item-value3 u-m-l-24">独享￥{{detail.exc_price || '--'}}</view>
			</view>
			
		</view>



		<u-toast ref="uToast"></u-toast>
		<view class="zhanwei2"></view>
		<view class="btn-bo flex flex_sa">
			<view class="btn1" @click="pay(1)">
				立即独享
			</view>
			<view class="btn2" @click="pay(2)">
				立即抢单
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				detail:[]
			}
		},
		onLoad(e) {
			this.id = e.id
			this.getDetail()
		},
		methods: {
			getDetail(){
				this.$api({
					url: '/lawyer/case_detail',
					method: 'get',
					data: {
						token:uni.getStorageSync("token"),
						id:this.id
						
					},
				}).then(res => {
					if (res.code == 1) {
						this.detail = res.data
						
					} 
				})
			},
			pay(e){
				let that = this
				uni.showModal({
					title: '提示',
					content: '确认抢单吗',
					success: function(res) {
						if (res.confirm) {
							that.$api({
								url: '/lawyer/grab',
								method: 'post',
								data: {
									token: uni.getStorageSync("token"),
									grab_type: e,
									order_id:that.detail.id
								},
							}).then(res => {
								if (res.code == 1) {
									// uni.navigateTo({
									// 	url: "/pages/index/paySuccess?list="+JSON.stringify(res.data)
									// })
									
									uni.showToast({
										icon: 'none',
										title: '抢单成功，剩余可抢单的线索条数'+res.data.last_clues,
										duration: 1500
									});
									
									setTimeout(()=>{
										uni.navigateBack()
									},1000)
								}
							})
						}
					}
				});
				
				
			},


		}
	}
</script>

<style scoped lang="scss">
	.sz-div {
		background-color: #fff;
		width: 686rpx;
		// height: 550rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin: 0 auto;
		padding: 0 24rpx;

		.item {
			width: 100%;
			// height: 110rpx;
			padding:32rpx 0;
			border-bottom: 1px solid #eee;
			
			

			.item-title {
				font-size: 28rpx;
				color: #666;
				width: 210rpx;
			}
			
			.item-value{
				font-size: 28rpx;
				color: #000000;
				line-height: 44rpx;
				
			}
			.item-value2{
				width: 420rpx;
			}
			.item-value3{
				padding: 2rpx 14rpx;
				background: #FFEBEB;
				border-radius: 20rpx 20rpx 20rpx 20rpx;
				font-size: 24rpx;
				color: #F81B19;
			}


		}
	}

	.zhanwei2 {
		width: 750rpx;
		height: 142rpx;
	}

	.btn-bo {
		width: 750rpx;
		height: 120rpx;
		background: #FFFFFF;
		box-shadow: 0rpx -2rpx 8rpx 2rpx rgba(0, 0, 0, 0.14);
		// padding-top: 14rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 9;
		
		
		.btn1{
			width: 332rpx;
			height: 92rpx;
			background: linear-gradient( 180deg, #FA2D2D 0%, #F40000 100%);
			border-radius: 46rpx 46rpx 46rpx 46rpx;
			font-size: 36rpx;
			color: #FFFFFF;
			line-height: 92rpx;
			text-align: center;
			font-weight: bold;
		}
		.btn2{
			width: 332rpx;
			height: 92rpx;
			background: #FFEBEB;
			border-radius: 46rpx 46rpx 46rpx 46rpx;
			border: 2rpx solid #FF9D9D;
			font-size: 36rpx;
			color: #F71818;
			line-height: 92rpx;
			text-align: center;
			font-weight: bold;
		}
		.btn_login_btn {
			width: 686rpx;
			height: 90rpx;
			background: linear-gradient(177deg, #FFF7EA 0%, #ECA561 100%);
			border-radius: 46rpx 46rpx 46rpx 46rpx;
			// margin-top: 116rpx;
			font-size: 36rpx;
			color: #713005;
			line-height: 90rpx;
			margin-left: 32rpx;
			text-align: center;
			font-weight: bold;
		}
	}
</style>